<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>登录页面</title>
    <link rel="stylesheet" type="text/css" href="css/index2.css">
    <link rel="stylesheet" type="text/css" href="css/ziy.css">

    <!-- 引入 layui.css -->
    <link href="layui/layui.css" rel="stylesheet">

    <link rel="stylesheet" href="bootstrap/bootstrap.min.css">
    <!--引入图标库-->
    <!--    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">-->

    <link rel="stylesheet" href="elementUI/elementCSS.css"/>
    <!--    &lt;!&ndash;引入element的图标库&ndash;&gt;-->
    <!--    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">-->

    <!-- <script src="js/jquery.min.js"></script>-->
</head>
<body>
<div id="app">


    <div class="beij_center">
        <div class="dengl_logo">
            <img src="img/logo.png" style="width: 393px; height:98px;">
        </div>
    </div>
    <div class="dengl_beij">

        <div class="banner_xin">
            <img src="img/login.png" style="position: relative;
    width: 500px;
    height: 426px;
    left: 15%;
}">
        </div>
        <div class="beij_center dengl_jvz">
            <div class="login_form">
                <div class="login_tab">
                    <h2>欢迎登录</h2>
                </div>
                <div class="kengl_kuang">
                    <div class="txt_kuang">
                        <input type="text" class="itxt" id="zhang" v-model="username" placeholder="请输入用户名">
                        <input type="password" class="itxt" id="mima" v-model="password" placeholder="请输入密码">
                    </div>
                    <div class="remember">
                        <div class="fl">
                            <input type="checkbox">
                            <label>自动登录</label>
                        </div>
                        <div class="fr">
                            <a href="#" class="fl" target="_blank" title="忘记密码">忘记密码?</a>
                        </div>
                    </div>
                    <button class="btnnuw body-btn" tabindex="5" @click="login">登 录</button>
                    <button class="btnnuw body-btn" v-if="false" tabindex="5" @click="check">检查</button>
                </div>
                <div class="corp_login">
                    <div class="regist_link">
                        <a href="zhuce.html" target="_blank">
                            <b></b>立即注册</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 引入 jQuery -->
<script src="js/jquery.min.js"></script>
<!-- 引入 layui.js -->
<script src="layui/layui.js"></script>
<script src="bootstrap/bootstrap.min.js"></script>
<script src="js/vue@2.js"></script>
<!-- 引入 Axios 库 -->
<script src="js/axios.min.js"></script>
<script src="elementUI/elementJS.js"></script>
<script src="js/data.js"></script>


<script>
    var vm = new Vue({
        el: '#app',
        data: {
            username: '',
            password: ''
        },
        methods: {
            login() {
                var username = $('#zhang').val();
                var password = $('#mima').val();

                console.log("您输入的用户名和密码是：");
                console.log(username);
                console.log(password);

                if (username == '') {
                    alert('请输入用户名');
                    return;
                }
                if (password == '') {
                    alert('请输入密码');
                    return;
                }
                const formdata = new FormData();
                formdata.append('username', username);
                formdata.append('password', password);

                axios.post(urlluodeng + '/user/login', formdata).then((response) => {
                    if (response.data.result) {
                        alert('登录成功');
                        window.location.href = '/book.html';

                    } else {
                        alert('用户名或密码错误');
                    }
                }).catch((error) => {
                    console.log(error);
                });
            },
            check() {
                axios.get(urlluodeng + '/user/getLoginUser').then((response) => {
                    if (response.data.result) {
                        alert(response.data.msg);
                        window.location.href = 'book.html';
                    }
                });
            }
        },
        created() {
            axios.get(urlluodeng + '/user/getLoginUser').then((response) => {
                if (response.data.result) {
                    alert(response.data.msg);
                    setTimeout(() => {
                        window.location.href = 'book.html';
                    }, 3000);
                }
            });
        }

    })

</script>
</body>
</html>
